<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>魅族</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--首页样式-->
    <link rel="stylesheet" href="./css/index.css">
<!--b5-->
    <link rel="stylesheet" href="./bootstrap/css/bootstrap.css">
</head>
<body>
<!--导航条-->
<div class="container">
    <nav class="navbar navbar-expand-lg navbar-light ">
        <div class="container-fluid">
            <a class="navbar-brand nav_brand_first" href="index.html">
                <img src="./images/big_logo.png" alt="">
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav  me-auto mb-2 mb-lg-0">
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">手机</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">声学</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">配件</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">Lipro</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">Flyme</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">服务</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="404.html">社区</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="buyoff.html">商品列表</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="map.html">地图</a>
                    </li>
                </ul>
            </div>
            <div class="input_fill">
                <div class="fill">
                    <input type="text" class="ipt" placeholder="魅族18s">
                    <a href="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
                            <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
                        </svg>
                    </a>
                    <a href="javascript:;" class="down_load">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 16 16">
                            <path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
                        </svg>
                        <!--添加一个弹出层-->
                        <div class="qrcode">
                            <span onclick='location.href=("login.html")'>立即登录</span>
                            <span onclick='location.href=("register.html")'>立即注册</span>
                            <span onclick='location.href=("404.html")'>我的订单</span>
                            <span onclick='location.href=("404.html")'>M码通道</span>
                        </div>
                    </a>
                    <a href="shoppingcart.html" class="minecart">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-minecart" viewBox="0 0 16 16">
                            <path d="M4 15a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm0 1a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm8-1a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm0 1a2 2 0 1 0 0-4 2 2 0 0 0 0 4zM.115 3.18A.5.5 0 0 1 .5 3h15a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 14 12H2a.5.5 0 0 1-.491-.408l-1.5-8a.5.5 0 0 1 .106-.411zm.987.82 1.313 7h11.17l1.313-7H1.102z"/>
                        </svg>
                    </a>
                </div>
            </div>
        </div>
    </nav>
    <!--轮播图-->
</div>
<!--轮播图-->
<div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">
    <div class="carousel-indicators">
        <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active"></button>
        <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1"></button>
        <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2"></button>
        <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="3"></button>
        <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="4"></button>
    </div>
    <div class="carousel-inner">
        <div class="carousel-item active">
            <img src="./images/3ae95fb1-f09e-4202-a92f-009c9df0f07e.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="./images/7eccb194-ddb3-44f5-b473-6c37d6287606.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="./images/9e73d0df-2d58-4ea8-9341-53e1b77d3294.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="./images/60bc9b03-8c77-4a06-91d8-9c0ae63ea328.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="./images/446c446e-f985-4f2f-86c7-4cc316fb801a.jpg" class="d-block w-100" alt="...">
        </div>
    </div>
    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Previous</span>
    </button>
    <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="visually-hidden">Next</span>
    </button>
</div>
<!--内容-->
<div class="index-container row">
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="magnify.html">
                <img src="./images/0a8d09b5-911a-4c3c-a3a5-5289ef8d2da2.jpg" alt="">
                <p>魅族18s</p>
                <p>低至2899起 享12期免息</p>
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="404.html">
                <img src="./images/1e0f6c1a-4251-4af1-bce4-6fc807c21163.png" alt="">
                <p>POP Pro 主动降噪耳机</p>
                <p>限时特惠369元</p>
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="404.html">
                <img src="./images/626fe48c-c5e7-4dae-b30a-d2b84eb6b64d.png" alt="">
                <p>渴物众筹 </p>
                <p>现已开启</p>
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item ">
            <a href="404.html">
                <img src="./images/13de22b5-2301-480f-99f9-778e4ff8644c.jpg" alt="">
                <p>mCycle</p>
                <p>以旧换新</p>
            </a>
        </li>
    </ul>
</div>
<!--手机-->
<div class="section-box section-phone-box">
<h3 style="text-align: center">手机</h3>
    <div class="row box_phone">
        <a href="404.html" class="img_phone">
            <img src="./images/c4ed4acb-467e-45fc-aad6-a7bb38de292e.jpg" alt="" class="img-fluid">
        </a>
    </div>
</div>
<!--奇趣探险-->
<div class="section-box section-qiqu-box">
    <h3 style="text-align: center">PANDAER 奇趣探索</h3>
    <div class="row box_qiqu">
        <a href="404.html" class="img_qiqu">
            <img src="./images/f239f18d-a02b-4f7c-a109-0ac1c964b78e.jpg" alt="" class="img-fluid">
        </a>
    </div>
</div>
<!--奇趣探险内容-->
<div class="index-container row">
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 ">
            <a href="404.html">
                <img src="./images/a4fc4463-475e-4328-a5d6-b2d4741e2c25.jpg" alt="" width="303px" height="375px">
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="404.html">
                <img src="./images/Cgbj0WIy15OABBEVAAqiHdUi_wo495.jpg" alt="" width="230px" height="230px">
                <p>PANDAER 全家桶</p>
                <p>【套餐立省154元】内含7件人气商品</p>
                <span style="color:red;font-size: 22px" class="goods-price"><i>￥</i>569<em></em><s style="text-decoration:line-through!important; color:#666666;font-size: 14px;">￥723</s></span></span>
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="404.html">
                <img src="./images/Cgbj0WGCqB-AaJ8fAAZSwtFn9oo674.png" alt="" width="230px" height="230px">
                <p>PANDAER X IQUNIX 超触感透明机械键盘</p>
                <p>【限时立省50元】F 区倾斜设计 | 80 键布局</p>
                <span style="color:red;font-size: 22px" class="goods-price"><i>￥</i>799起<em></em></span>
            </a>
        </li>
    </ul>
    <ul class="clearfix four-ad col-lg-3 col-md-6 col-12">
        <li class="adv-box-1 item">
            <a href="404.html">
                <img src="./images/Cgbj0GHeNNiAE7AbAAcTIFK3UN0553.png" alt="" width="230px" height="230px">
                <p>PANDAER X 闪极 130W 可视移动电源</p>
                <p>魅族 17、18系列 适配 | 20000mAh 持久续航</p>
                <span style="color:red;font-size: 22px" class="goods-price"><i>￥</i>999<em></em></span>
            </a>
        </li>
    </ul>
</div>
<!--页脚-->
<div class="meizu-footer-link row">
    <div class="footer_left col-lg-9">
        <ul class="meizu-footer-service col-lg-2 col-md-4 col-6">
            <li class=" ">
                <a href="404.html">
                    <img src="./images/2c69bf7c-2d29-4fd4-852e-0aa497f36f51.png" alt="" width="50px" height="39px">
                    <span>满80免运费</span>
                </a>
            </li>
        </ul>
        <ul class=" meizu-footer-service four-ad col-lg-2 col-md-4 col-6">
            <li class="">
                <a href="404.html">
                    <img src="./images/d28eac8b-b915-49dc-9dbd-80884a07d44f.png" alt="" width="50px" height="39px">
                    <span>100+ 城市次日送达</span>
                </a>
            </li>
        </ul>
        <ul class="meizu-footer-service four-ad col-lg-2 col-md-4 col-6">
            <li class="">
                <a href="404.html">
                    <img src="./images/b21f3e65-f7f4-4693-914c-c070faf96770.png" alt="" width="50px" height="39px">
                    <span>7天无理由退货</span>
                </a>
            </li>
        </ul>
        <ul class="meizu-footer-service four-ad col-lg-2 col-md-4 col-6">
            <li class="">
                <a href="404.html">
                    <img src="./images/1998f0da-a439-4e07-9736-e6a1c39fb0ae.png" alt="" width="50px" height="39px">
                    <span>15天换货保障</span>
                </a>
            </li>
        </ul>
        <ul class="meizu-footer-service four-ad col-lg-2 col-md-4 col-6">
            <li class="">
                <a href="404.html">
                    <img src="./images/420825c1-4763-436d-b3e1-721651ccc70c.png" alt="" width="50px" height="39px">
                    <span>1年免费保修</span>
                </a>
            </li>
        </ul>
        <ul class="meizu-footer-service col-lg-2 col-md-4 col-6">
            <li class="">
                <a href="404.html">
                    <img src="./images/1c5cfeff-1b35-499e-bc2a-1fd29305be69.png" alt="" width="50px" height="39px">
                    <span>上门快修</span>
                </a>
            </li>
        </ul>
    </div>
    <div class="footer_right col-lg-3">
        <ul>
            <li>
                <span style="font-size: 12px;color: #9999">周一至周日 8:00-20:00</span>
                <p style="color: #008cff;font-size: 25px">400-788-3333</p>
                    <input type="button" value="在线客服" onclick='location.href=("404.html")'>
            </li>
        </ul>
    </div>
</div>
<!--返回顶部-->
<div class="box"></div>
<div class="box1"></div>
<div id="btn">
    <img src="./images/arrow-up-square.svg" width="50px" height="40px">
</div>
<script src="./js/index.js"></script>
<script src="bootstrap/js/jquery.min.js" ></script>
<script src="bootstrap/js/bootstrap.bundle.js" ></script>
</body>
</html>